         <style lang="less">
@import "./hotelManage.less";
</style>
<template>
    <div>
      <div class="search" id="hotelManagePage" v-show="hotelManagePageVisible">
          <Row>
              <Col>
                  <Card>
                      <Row>
                          <Form ref="searchForm" :model="searchForm" inline :label-width="70" class="search-form">
                              <Form-item label="酒店标题" prop="title">
                                <Input type="text" v-model="searchForm.title" clearable placeholder="请输入酒店标题" style="width: 200px"/>
                              </Form-item>
                              <Form-item label="酒店卖点" prop="sellpoint">
                                <Input type="text" v-model="searchForm.sellpoint" clearable placeholder="请输入酒店卖点" style="width: 200px"/>
                              </Form-item>
                              <Form-item label="酒店星级" prop="hotelRandid">
                                <Input type="text" v-model="searchForm.hotelRandid" clearable placeholder="请输入酒店星级" style="width: 200px"/>
                              </Form-item>
                              <Form-item label="酒店电话" prop="telephone">
                                <Input type="text" v-model="searchForm.telephone" clearable placeholder="请输入酒店电话" style="width: 200px"/>
                              </Form-item>
                              <span v-if="drop">
                                <Form-item label="价格区间" prop="price">
                                  <Input type="text" v-model="searchForm.price" clearable placeholder="请输入邮箱" style="width: 200px"/>
                                </Form-item>
                                <Form-item label="状态" prop="status">
                                  <Select v-model="searchForm.status" placeholder="请选择" clearable style="width: 200px">
                                    <Option value="0">审核通过</Option>
                                    <Option value="1">未审核</Option>
                                  </Select>
                                </Form-item>
                                <Form-item label="创建时间" prop="createTime">
                                  <DatePicker type="daterange" format="yyyy-MM-dd" clearable @on-change="selectDateRange" placeholder="选择起始时间" style="width: 200px"></DatePicker>
                                </Form-item>
                              </span>
                              <Form-item style="margin-left:-35px;">
                                <Button @click="handleSearch" type="primary" icon="search">搜索</Button>
                                <Button @click="handleReset" type="ghost" >重置</Button>
                                <a class="drop-down" @click="dropDown">{{dropDownContent}}
                                  <Icon :type="dropDownIcon"></Icon>
                                </a>
                              </Form-item>
                          </Form>
                      </Row>
                      <Row class="operation">
                          <Button @click="addHotel" type="primary" icon="plus-round">添加酒店</Button>
                          <Button @click="delAll" type="ghost" icon="trash-a">批量删除</Button>
                          <Dropdown @on-click="handleDropdown">
                            <Button type="ghost">
                                更多操作
                                <Icon type="arrow-down-b"></Icon>
                            </Button>
                            <DropdownMenu slot="list">
                                <DropdownItem name="refresh">刷新</DropdownItem>
                                <DropdownItem name="exportData">导出所选数据</DropdownItem>
                            </DropdownMenu>
                          </Dropdown>
                      </Row>
                      <Row>
                          <Alert show-icon>
                              已选择 <span class="select-count">{{selectCount}}</span> 项
                              <a class="select-clear" @click="clearSelectAll">清空</a>
                          </Alert>
                      </Row>
                      <Row class="margin-top-10 searchable-table-con1">
                          <Table :loading="loading" border :columns="columns" :data="data" sortable="custom" @on-sort-change="changeSort" @on-selection-change="showSelect" ref="table" highlight-row></Table>
                          <!-- <Table :loading="loading" border :columns="columns" :data="data" sortable="custom" @on-sort-change="changeSort" @on-selection-change="showSelect" @on-row-click="getCurrentHotelRoom" ref="table" highlight-row></Table> -->
                          <Table :columns="columns" :data="exportData" ref="exportTable" style="display:none"></Table>
                      </Row>
                      <Row type="flex" justify="end" class="code-row-bg page">
                          <Page :current="this.searchForm.pageNumber" :total="total" :page-size="this.searchForm.pageSize" @on-change="changePage" @on-page-size-change="changePageSize" :page-size-opts="[10,20,50,100]" size="small" show-total show-elevator show-sizer></Page>
                      </Row>
                  </Card>
              </Col>
          </Row>

          <Modal :title="modalTitle" v-model="hotelReviewModalVisible" :mask-closable='false' :width="500">
              <Form ref="hotelReviewForm" :model="hotelReviewForm" :label-width="100" :rules="hotelReviewFormValidate">
                  <FormItem label="审核状态" prop="reviewStatus">
                      <RadioGroup v-model="hotelReviewForm.reviewStatus" @on-change="hotelRevewStatusChange">
                        <Radio label="0">未审核</Radio>
                        <Radio label="-1">未通过</Radio>
                        <Radio label="1">通过</Radio>
                    </RadioGroup>
                  </FormItem>
                  <FormItem label="未通过原因描述" prop="nopassReason" v-if="hotelReviewForm.nopassReasonVisible">
                      <!-- <Input v-model="hotelReviewForm.nopassReason"/> -->
                      <textarea v-model="hotelReviewForm.nopassReason" style="width:340px;height:60px;resize:none;line-height:2.0;border:1px solid #dddee1;"/>
                  </FormItem>          
              </Form>
              <div slot="footer">
                  <Button type="text" @click="cancelHotelReview">取消</Button>
                  <Button type="primary" :loading="submitLoading" @click="submitHotelReview">提交</Button>
              </div>
          </Modal>

      </div>
      <div class="search" id="hotelDetailPage" v-show="hotelDetailPageVisible" style="background-color:white;padding:20px;">
        <hotel-detail ref="hotelDetailComp" @on-hotel-cancel="hotelDetailCancel" @on-hotel-success="hotelSubmitSuccess"></hotel-detail>
        <!-- <goods-detail ref="goodsDetailComp" @on-goods-cancel="goodsDetailCancel" @on-goods-success="goodsSubmitSuccess"></goods-detail> -->
      </div>

      <!-- hotel-room start -->
      <div class="search" id="hotelRoomManagePage" v-show="hotelRoomManagePageVisible">
          <Row>
              <Col>
                  <Card>
                      <Row class="operation">
                          <div style="height:30px;line-height:30px;">
                            <Button @click="addHotelRoom" type="primary" icon="plus-round">添加酒店房型</Button>
                            <div style="min-width:200px;display:inline-block;border:1px solid #dddee1;border-radius:4px;margin-left:10px;padding-left:10px;color:#2d8cf0;">
                              <span>当前酒店：</span>
                              <span>{{currentSelectedHotel.title}}</span>
                            </div>
                          </div>  
                      </Row>
                      <Row class="margin-top-10 searchable-table-con1">
                          <Table :loading="hotelRoomLoading" border :columns="hotelRoomColumns" :data="hotelRoomData" sortable="custom" @on-sort-change="changeSort" @on-selection-change="showSelect" ref="table"></Table>
                          <Table :columns="hotelRoomColumns" :data="exportData" ref="exportTable" style="display:none"></Table>
                      </Row>
                  </Card>
              </Col>
          </Row>
      </div>
      <!-- hotel-room end -->

      <!-- hotel-room-detail start -->
      <div class="search" id="hotelRoomDetailPage" v-show="hotelRoomDetailPageVisible" style="background-color:white;padding:20px;">
        <hotel-room-detail ref="hotelRoomDetailComp" @on-hotel-room-cancel="hotelRoomDetailCancel" @on-hotel-room-success="hotelRoomSubmitSuccess"></hotel-room-detail>

        <!-- <template>
          <Form ref="hotelRoomDetailForm" :model="hotelRoomDetailForm" :label-width="110" :rules="hotelRoomDetailFormValidate">
            <Tabs type="card">
              <TabPane label="房型基础信息" style="border-left: 1px solid #dddee1;">
                <Form-item label="当前酒店:" style="padding-top:16px;">999
                </Form-item>
                <Form-item label="房型名称:" prop="roomName">
                  <Input type="text" v-model="hotelRoomDetailForm.roomName" clearable style="width: 500px"/>
                </Form-item>
                <Form-item label="房型说明:" prop="description">
                  <textarea type="text" v-model="hotelRoomDetailForm.description" clearable placeholder="请输入房型说明" style="border:1px solid #dddee1; width:500px;height:120px;resize:none;line-height:2.0"/>
                </Form-item>

                <Form-item label="门市价:" prop="sellprice">
                  <Input type="text" v-model="hotelRoomDetailForm.sellprice" clearable style="width: 120px"/>
                  <span style="display:inline-block;margin-left:6px;">元</span>
                </Form-item>
                <Form-item label="优惠价:" prop="price">
                  <Input type="text" v-model="hotelRoomDetailForm.price" clearable style="width: 120px"/>
                  <span style="display:inline-block;margin-left:6px;">元</span>
                </Form-item>
                <Form-item label="房间面积:" prop="roomarea">
                  <Input type="text" v-model="hotelRoomDetailForm.roomarea" clearable style="width: 120px"/>
                  <span style="display:inline-block;margin-left:6px;">㎡</span>
                </Form-item>
                <Form-item label="房间楼层:" prop="roomfloor">
                  <Input type="text" v-model="hotelRoomDetailForm.roomfloor" clearable style="width: 120px"/>
                  <span style="display:inline-block;margin-left:6px;">层</span>
                </Form-item>
                <Form-item label="房间数:" prop="number">
                  <Input type="text" v-model="hotelRoomDetailForm.number" clearable style="width: 120px"/>
                  <span style="display:inline-block;margin-left:6px;">间</span>
                </Form-item>
                <Form-item label="床型:" prop="roomstyle">
                  <RadioGroup v-model="hotelRoomDetailForm.roomstyle">
                    <Radio label="0">单床1.5米</Radio>
                    <Radio label="1">大床1.8米</Radio>
                    <Radio label="2">大床2米</Radio>
                    <Radio label="3">双床1.2米</Radio>
                    <Radio label="4">双床1.5米</Radio>
                    <Radio label="5">双床1.8米</Radio>
                    <Radio label="6">三床2米</Radio>
                  </RadioGroup>
                </Form-item>
                <Form-item label="窗户:">
                  <RadioGroup>
                    <Radio label="0">有窗</Radio>
                    <Radio label="1">内窗</Radio>
                    <Radio label="2">无窗</Radio>
                  </RadioGroup>
                </Form-item>
                <Form-item label="餐标:">
                  <RadioGroup>
                    <Radio label="0">单早</Radio>
                    <Radio label="1">双早</Radio>
                    <Radio label="2">早晚餐</Radio>
                    <Radio label="2">三餐</Radio>
                    <Radio label="2">一价全包</Radio>
                  </RadioGroup>
                </Form-item>
                <Form-item label="宽带:">
                  <RadioGroup>
                    <Radio label="0">有线</Radio>
                    <Radio label="1">WIFI</Radio>
                  </RadioGroup>
                </Form-item>

                <hr style="border-bottom:1px solid #dddee1; height:1px;">

                <Form-item label="预订送积分:" prop="pointBook" style="padding-top:16px;">
                  <Input type="text" v-model="hotelRoomDetailForm.pointBook" clearable style="width: 120px"/>
                  <span style="display:inline-block;margin-left:6px;">分</span>
                </Form-item>
                <Form-item label="积分抵现金:" prop="pointPrice">
                  <Input type="text" v-model="hotelRoomDetailForm.pointPrice" clearable style="width: 120px"/>
                  <span style="display:inline-block;margin-left:6px;">元</span>
                </Form-item>
                <Form-item label="评论送积分:" prop="pointComment">
                  <Input type="text" v-model="hotelRoomDetailForm.pointComment" clearable style="width: 120px"/>
                  <span style="display:inline-block;margin-left:6px;">分</span>
                </Form-item>
                <Form-item label="支付方式:" prop="payType">
                  <RadioGroup v-model="hotelRoomDetailForm.payType">
                    <Radio label="0">微信支付</Radio>
                    <Radio label="1">支付宝支付</Radio>
                    <Radio label="2">银行卡支付</Radio>
                    <Radio label="3">门店支付</Radio>
                  </RadioGroup>
                </Form-item>

                <hr style="border-bottom:1px solid #dddee1; height:1px;">

                <Form-item label="报价:" style="margin-top:20px;">
                  <template>
                    <Tabs value="name1" type="card" style="width:500px;">
                        <TabPane label="所有日期" name="name1">
                          <div style="display:inline-block;margin-top:20px;">
                            <span style="display: inline-block;width:80px;text-align:left;">日期范围:</span>
                            <Input type="text" clearable style="width: 120px;margin-right:10px;"/>
                            <span>~</span>
                            <Input type="text" clearable style="width: 120px;margin-left:10px;"/> 
                          </div>
                          <div style="display:inline-block;margin-top:20px;">
                            <span style="display: inline-block;width:80px;text-align:left;">价格:</span>
                            <span>成本</span>
                            <Input type="text" clearable style="width: 90px;margin-right:10px;"/>
                            <span>+利润</span>
                            <Input type="text" clearable style="width: 90px;margin-left:10px;margin-right:10px;"/> 
                            <span>售价：</span>
                          </div>
                          <div style="display:inline-block;margin-top:20px;">
                            <span style="display: inline-block;width:80px;text-align:left;">价格描述:</span>
                            <Input type="text" clearable style="width: 270px;margin-right:10px;"/>
                          </div>
                          <div style="display:inline-block;margin-top:20px;">
                            <span style="display: inline-block;width:80px;text-align:left;">库存:</span>
                            <Input type="text" clearable style="width: 170px;margin-right:10px;"/>
                            <span>-1表示不限</span>
                          </div>
                        </TabPane>
                        <TabPane label="按星期" name="name2">


                        </TabPane>
                        <TabPane label="按号数" name="name3">

                        
                        </TabPane>
                    </Tabs>
                </template>
                </Form-item>           
                
                <hr style="border-bottom:1px solid #dddee1; height:1px;">

              </TabPane>

              <TabPane label="图片">
              </TabPane>  

            </Tabs>
          </Form>
          <div style="padding:16px 0px;margin-left:2px;" class="operation">
            <Button @click="cancelSubmitHotelRoom" type="ghost" icon="android-arrow-back" style="width:120px;margin-right:10px;">返回主页</Button>
            <Button :loading="submitLoading" @click="submitHotelRoom" type="primary" :icon="hotelRoomButtonTypeIcon" style="width:120px;">{{hotelRoomButtonTypeText}}</Button>
          </div>
        </template> -->

      </div>



      <!-- hotel-room-detail end -->


      <!-- <my-dialog></my-dialog> -->
      <tag-modal ref="tagModal" @on-tag-checked="tagCheckedBack"></tag-modal>

    </div>
</template>

<script>

import dateFormatUtil from "@/utils/dateFormatUtil";
// import MyDialog from './dialog';
import HotelDetail from "./hotelDetail.vue";
import HotelRoomDetail from "./hotelRoomDetail.vue"

import TagModal from './tagModal';

export default {
  name: "hotel-manage",
  components:{
    // MyDialog,
    TagModal,
    HotelDetail,
    HotelRoomDetail
  },
  data() {
    const validatePassword = (rule, value, callback) => {
      if (value.length < 6) {
        callback(new Error("密码长度不得小于6位"));
      } else {
        callback();
      }
    };
    const validateMobile = (rule, value, callback) => {
      var reg = /^[1][3,4,5,7,8][0-9]{9}$/;
      if (!reg.test(value)) {
        callback(new Error("手机号格式错误"));
      } else {
        callback();
      }
    };
    const validatelineNameNoBlank = (rule, value, callback) => {
      var validObj = rule.validObj;
      // var reg = /\s+/g;  //注意：正则规则不带引号 所以对象中传入也不能带引号 
      // var reg = new RegExp(/\s+/g); //不使用new RegExp 时灵时不灵
      var reg = new RegExp(validObj.regexp);
      if (reg.test(value)) {
        callback(new Error(validObj.msg));
      } else {
        callback();
      }
    };
    return {
      loading: true,
      drop: false,
      hotelManagePageVisible: true,
      hotelDetailPageVisible: false,
      hotelRoomManagePageVisible: false,
      hotelRoomDetailPageVisible: false,
      dropDownContent: "展开",
      dropDownIcon: "chevron-down",
      selectCount: 0,
      selectList: [],
      searchForm: {
        lineName: "",
        alias: "",
        mobilePhone: "",
        email: "",
        qq: "",
        sex: "",
        startBirthday: "",
        endBirthday: "",
        status: "",
        pageNumber: 1,
        pageSize: 10,
        sort: "createTime",
        order: "desc",
        startDate: "",
        endDate: ""
      },
      // modalType: 0,
      hotelDetailModalType: 0,
      hotelRoomDetailModalType: 0,
      hotelReviewModalVisible: false,
      modalTitle: "",
      hotelReviewForm: {
        reviewHotelId: "",
        reviewStatus: "0",
        nopassReason: "",
        nopassReasonVisible: false
      },
      hotelDetailPropetyForm:{

      },
      userRoles: [],
      roleList: [],
      errorPass: "",
      hotelReviewFormValidate: {
        // lineName: [
        //   { required: true, message: "会员名称不能为空", trigger: "blur" },
        //   { max: 64, message: '会员名称太长'},
        //   // { validator: 'regexp', pattern: /\s+/g, message: '会员名称不允许包含空格',trigger: "change,blur"}
        //   { validator: validatelineNameNoBlank, validObj:{regexp:/\s+/g,msg:"会员名称不允许包含空格"} ,trigger: "blur"}
        // ]
      },
      submitLoading: false,
      columns: [
        {
          type: "selection",
          width: 60,
          align: "center"
        },
        {
          title: "酒店名称",
          key: "title",
          width: 120,
          sortable: true
        },
        {
          title: "酒店卖点",
          key: "sellpoint",
          width: 120,
          sortable: true
        },
        {
          title: "星级",
          key: "hotelRankid",
          width: 100,
          sortable: true
        },
        {
          title: "门市价",
          key: "price",
          width: 120,
          sortable: true
        },
        {
          title: "联系电话",
          key: "telephone",
          width: 120,
          sortable: true
        },
        {
          title: "有效期",
          key: "email",
          width: 160,
          sortable: true
        },
        {
          title: "审核状态",
          key: "status",
          align: "center",
          width: 150,
          render: (h, params) => {
            let re = "";
            if (params.row.status === 0) {
              return h("div", [
                h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: "red"
                    }
                  },
                  "未审核"
                )
              ]);
            } else if (params.row.status === -1) {
              return h("div", [
                h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: "red"
                    }
                  },
                  "未通过"
                )
              ]);
            } else if (params.row.status === 1) {
              return h("div", [
                h(
                  "Tag",
                  {
                    props: {
                      type: "dot",
                      color: "green"
                    }
                  },
                  "通过"
                )
              ]);
            }
          },
          filters: [
            {
              label: "未审核",
              value: 0
            },
            {
              label: "未通过",
              value: -1
            },
            {
              label: "通过",
              value: 1
            }
          ],
          filterMultiple: false,
          filterMethod(value, row) {
            if (value === 0) {
              return row.status === 0;
            } else if (value === -1) {
              return row.status === -1;
            } else if (value === 1) {
              return row.status === 1;
            }
          }
        },
        {
          title: "创建时间",
          key: "createTime",
          sortable: true,
          sortType: "desc",
          width: 150
        },
        {
          title: "操作",
          key: "action",
          width: 340,
          align: "center",
          render: (h, params) => {
            if (params.row.status === 10) {
              return h("div", [
                h(
                  "Button",
                  {
                    props: {
                      type: "primary",
                      size: "small"
                    },
                    style: {
                      marginRight: "5px"
                    },
                    on: {
                      click: () => {
                        this.edit(params.row);
                      }
                    }
                  },
                  "编辑"
                ),
                h(
                  "Button",
                  {
                    props: {
                      type: "ghost",
                      size: "small"
                    },
                    style: {
                      marginRight: "5px"
                    },
                    on: {
                      click: () => {
                        this.disable(params.row);
                      }
                    }
                  },
                  "禁用"
                ),
                h(
                  "Button",
                  {
                    props: {
                      type: "error",
                      size: "small"
                    },
                    on: {
                      click: () => {
                        this.remove(params.row);
                      }
                    }
                  },
                  "删除"
                )
              ]);
            } else {
              return h("div", [
                h(
                  "Button",
                  {
                    props: {
                      type: "primary",
                      size: "small"
                    },
                    style: {
                      marginRight: "5px"
                    },
                    on: {
                      click: () => {
                        this.edit(params.row);
                      }
                    }
                  },
                  "编辑"
                ),
                h(
                  "Button",
                  {
                    props: {
                      type: "success",
                      size: "small"
                    },
                    style: {
                      marginRight: "5px"
                    },
                    on: {
                      click: () => {
                        this.review(params.row);
                      }
                    }
                  },
                  "审核"
                ),
                h(
                  "Button",
                  {
                    props: {
                      type: "info",
                      size: "small"
                    },
                    style: {
                      marginRight: "5px"
                    },
                    on: {
                      click: () => {
                        this.edit(params.row);
                      }
                    }
                  },
                  "查看"
                ),
                h(
                  "Button",
                  {
                    props: {
                      type: "warning",
                      size: "small"
                    },
                    style: {
                      marginRight: "5px"
                    },
                    on: {
                      click: () => {
                        this.roomView(params.row);
                      }
                    }
                  },
                  "房型"
                ),
                h(
                  "Button",
                  {
                    props: {
                      type: "error",
                      size: "small"
                    },
                    on: {
                      click: () => {
                        this.remove(params.row);
                      }
                    }
                  },
                  "删除"
                )
              ]);
            }
          }
        }
      ],
      data: [],
      exportData: [],
      total: 0,
      selectedTagsArr: [],
      currentSelectedHotel: ''

      //hotelDetail start
      ,
      hotelDetailPropetyModalVisible: false,
      hotelDetailTagModalVisible: false,
      hotelButtonTypeText: "添加",
      hotelButtonTypeIcon: "plus-round",
      hotelRoomButtonTypeText: "添加房型",
      hotelRoomButtonTypeIcon: "plus-round",
      hotelDetailForm: {
        title: "",
        sellpoint: "",
        address: "",
        lng: "",
        lat: "",
        telephone: "",
        opentime: "",
        decoratetime: "",
        property: "",
        hotelRankid: "",
        tagword: "",
        satisfyscore: "",
        content: "",
        service: "",
        traffic: "",
        notice: "",
        arroundspots: ""
      },
      hotelDetailFormValidate: {
        title: [
          { required: true, message: "酒店标题不能为空", trigger: "blur" },
          { max: 64, message: '酒店标题不能超过64个字符'}
        ]
      },
      //hotelDetail end


      //hotelRoom start
      hotelRoomLoading: false,
      hotelRoomColumns: [
        {
          type: "selection",
          width: 60,
          align: "center"
        },
        // {
        //   title: "酒店名称",
        //   key: "hotelId",
        //   width: 120,
        //   sortable: true
        // },
        {
          title: "酒店名称",
          key: "hotel",
          width: 120,
          sortable: true,
          align: "center",
          render: (h, params) => {
            let re = "";
            if(params.row.hotel != null){
              re = params.row.hotel.title;
            }
            return h("span", re);
          }
        },
        {
          title: "房型名称",
          key: "roomName",
          width: 120,
          sortable: true
        },
        {
          title: "预定积分",
          key: "pointBook",
          width: 120,
          sortable: true
        },
        {
          title: "评论积分",
          key: "pointComment",
          width: 120,
          sortable: true
        },
        {
          title: "积分低现",
          key: "pointPrice",
          width: 120,
          sortable: true
        },
        {
          title: "最低价格",
          key: "price",
          width: 150,
          sortable: true
        },
        {
          title: "最低利润",
          key: "createTime",
          sortable: true,
          sortType: "desc",
          width: 150
        },
        {
          title: "报价有效期",
          key: "createTime",
          width: 150,
          sortable: true
        },
        {
          title: "操作",
          key: "action",
          width: 340,
          align: "center",
          render: (h, params) => {
            
              return h("div", [
                h(
                  "Button",
                  {
                    props: {
                      type: "primary",
                      size: "small"
                    },
                    style: {
                      marginRight: "5px"
                    },
                    on: {
                      click: () => {
                        this.editHotelRoom(params.row);
                      }
                    }
                  },
                  "编辑"
                ),
                h(
                  "Button",
                  {
                    props: {
                      type: "error",
                      size: "small"
                    },
                    on: {
                      click: () => {
                        this.removeHotelRoom(params.row);
                      }
                    }
                  },
                  "删除"
                )
              ]);
             
          }
        }
      ],
      hotelRoomData: []

      //hotelRoom end

      //hotelRoom detail start
      ,
      hotelRoomDetailForm:{

      },
      
      hotelRoomDetailFormValidate: {
        roomName: [
          { required: true, message: "酒店房型名称不能为空", trigger: "blur" },
          { max: 64, message: '酒店标题不能超过64个字符'}
        ]
      },


      //hotelRoom detail end



    };
  },
  methods: {
    init() {
      this.hotelManagePageVisible = true;
      this.hotelDetailPageVisible = false;
      this.hotelRoomManagePageVisible = true;
      this.hotelRoomDetailPageVisible = false;
      this.getHotelList();
      this.cleanSelectCount();
    },
    changePage(v) {
      this.searchForm.pageNumber = v;
      this.getHotelList();
    },
    changePageSize(v) {
      this.searchForm.pageSize = v;
      this.getHotelList();
    },
    selectDateRange(v) {
      if (v) {
        this.searchForm.startDate = v[0];
        this.searchForm.endDate = v[1];
      }
    },
    selectBirthdayDateRange(v) {
      if (v) {
        this.searchForm.startBirthday = v[0];
        this.searchForm.endBirthday = v[1];
      }
    },
    getHotelList() {
      this.loading = true;      
      this.getRequest("/hotel/list", this.searchForm).then(res => {  
        this.loading = false;
        if (res.success === true) {
          this.data = res.result.content;
          this.total = res.result.totalElements;
        }
      });
      // if(!this.currentSelectedHotel){
      //   this.getHotelRoomListByHotelId(this.currentSelectedHotel.id);
      // }
    },
    roomView(v){
      this.hotelRoomManagePageVisible = true;
      this.currentSelectedHotel = v;
      this.getHotelRoomListByHotelId(v.id);
    },
    getCurrentHotelRoom(id){
      this.getHotelRoomListByHotelId(v.id);
    },  
    getHotelRoomListByHotelId(currHotelId) {
      this.hotelRoomLoading = true;      
      this.getRequest("/hotel/getHotelRoomById", {id:currHotelId}).then(res => {  
        this.hotelRoomLoading = false;
        if (res.success === true) {
          this.hotelRoomData = res.result;
        }else{
          this.hotelRoomData = [];
        }
      });
    },
    handleSearch() {
      this.searchForm.pageNumber = 1;
      this.searchForm.pageSize = 10;
      this.init();
    },
    handleReset() {
      this.$refs.searchForm.resetFields();
      this.searchForm.pageNumber = 1;
      this.searchForm.pageSize = 10;
      // 重新加载数据
      this.init();
    },
    changeSort(e) {
      this.searchForm.sort = e.key;
      this.searchForm.order = e.order;
      if (e.order === "normal") {
        this.searchForm.order = "";
      }
      this.init();
    },
    getRoleList() {
      this.getRequest("/role/getAllList").then(res => {
        if (res.success === true) {
          this.roleList = res.result;
        }
      });
    },
    handleDropdown(name) {
      if (name === "exportData") {
        if (this.selectCount <= 0) {
          this.$Message.warning("您还未选择要导出的数据");
          return;
        }
        this.$Modal.confirm({
          title: "确认导出",
          content: "您确认要导出所选 " + this.selectCount + " 条数据?",
          onOk: () => {
            this.$refs.exportTable.exportCsv({
              filename: "用户数据"
            });
          }
        });
      } else if (name === "refresh") {
        this.getHotelList();
      }
    },
    selectRoles(v) {},
    hotelRevewStatusChange(value) {
      (value === "-1") ? (this.hotelReviewForm.nopassReasonVisible = true) : (this.hotelReviewForm.nopassReasonVisible = false);
    },
    cancelHotelReview() {
      this.hotelReviewModalVisible = false;
    },
    submitHotelReview() {
      let url = "";
      url = "/hotel/review";
      let reviewHotel = {};
      reviewHotel.hotelId = this.hotelReviewForm.reviewHotelId;
      reviewHotel.status = this.hotelReviewForm.reviewStatus;
      console.log(reviewHotel);
      this.submitLoading = true;
      this.putRequest(url, reviewHotel).then(res => {
        this.submitLoading = false;
        if (res.success === true) {
          this.$Message.success("审核操作成功");
          this.init();
          this.hotelReviewModalVisible = false;
        }
      });

      // 暂未做验证
      // this.$refs.hotelReviewForm.validate(valid => {
      //   if (valid) {
      //   }
      // });
    },

    addHotel(v) {
     
      // this.$refs.hotelDetailTab.activeKey = 0;
      this.$refs.hotelDetailComp.resetFormByType(0,null);
      //切换界面显示隐藏
      this.hotelManagePageVisible = false;
      this.hotelDetailPageVisible = true;
      this.hotelRoomManagePageVisible = false;
      this.hotelRoomDetailPageVisible = false;

    },
    edit(v) {
      let editHotelId = v.id;
      this.loading = true;
      this.getRequest("/hotel/getHotelById/" + editHotelId).then(res =>{
        this.loading = false;
        let editHotel = res.result;

        this.$refs.hotelDetailComp.resetFormByType(1, editHotel);

        //切换界面显示隐藏
        this.hotelManagePageVisible = false;
        this.hotelDetailPageVisible = true;
        this.hotelRoomManagePageVisible = false;
        this.hotelRoomDetailPageVisible = false;
      })

    },


    review(v) {
      this.modalTitle = "酒店审核";
      this.hotelReviewForm.reviewStatus = v.status + "";
      this.hotelReviewForm.reviewHotelId = v.id;
      // //如果状态为未通过：说明原因
      (v.status === -1) ? (this.hotelReviewForm.nopassReasonVisible = true) : (this.hotelReviewForm.nopassReasonVisible = false);
      this.hotelReviewModalVisible = true;
    },
    enable(v) {
      this.$Modal.confirm({
        title: "确认启用",
        content: "您确认要启用用户 " + v.lineName + " ?",
        onOk: () => {
          this.postRequest("/line/enable/" + v.id).then(res => {
            if (res.success === true) {
              this.$Message.success("操作成功");
              this.init();
            }
          });
        }
      });
    },
    disable(v) {
      this.$Modal.confirm({
        title: "确认禁用",
        content: "您确认要禁用用户 " + v.lineName + " ?",
        onOk: () => {
          this.postRequest("/line/disable/" + v.id).then(res => {
            if (res.success === true) {
              this.$Message.success("操作成功");
              this.init();
            }
          });
        }
      });
    },
    remove(v) {
      this.$Modal.confirm({
        title: "确认删除",
        content: "您确认要删除用户 " + v.title + " ?",
        onOk: () => {
          this.deleteRequest("/hotel/delete/", { ids: v.id }).then(res => {
            if (res.success === true) {
              this.$Message.success("删除成功");
              this.init();
            }
          });
        }
      });
    },
    dropDown() {
      if (this.drop) {
        this.dropDownContent = "展开";
        this.dropDownIcon = "chevron-down";
      } else {
        this.dropDownContent = "收起";
        this.dropDownIcon = "chevron-up";
      }
      this.drop = !this.drop;
    },
    showSelect(e) {
      this.exportData = e;
      this.selectList = e;
      this.selectCount = e.length;
    },
    clearSelectAll() {
      this.$refs.table.selectAll(false);
      this.cleanSelectCount();
    },
    cleanSelectCount(){
      this.selectCount = 0;
    },
    delAll() {
      if (this.selectCount <= 0) {
        this.$Message.warning("您还未选择要删除的数据");
        return;
      }
      this.$Modal.confirm({
        title: "确认删除",
        content: "您确认要删除所选的 " + this.selectCount + " 条数据?",
        onOk: () => {
          let ids = "";
          this.selectList.forEach(function(e) {
            ids += e.id + ",";
          });
          ids = ids.substring(0, ids.length - 1);
          this.deleteRequest("/hotel/delete/", { ids: ids }).then(res => {
            if (res.success === true) {
              this.$Message.success("删除成功");
              this.init();
            }
          });
        }
      });
    },

    tagCheckedBack(res){
      this.selectedTagsArr = res;
    },
    tagsCloseHandle(event, name){
      let closeTagId = name;
      var _this = this;
      let afterTagsArr = [];
      this.selectedTagsArr.forEach(function(eachItem){  
        if(eachItem.id == closeTagId){ //跳出循环
          return;
        }
        afterTagsArr.push(eachItem);
      });
      this.selectedTagsArr = afterTagsArr;
    }

    //hotel detail start
    ,
    hotelDetailCancel:function(v){
      if(v){
        this.hotelManagePageVisible = true;
        this.hotelDetailPageVisible = false;
        this.hotelRoomManagePageVisible = true;
        this.hotelRoomDetailPageVisible = false;
      }
    },
    hotelSubmitSuccess: function(v){
      if(v){
        this.hotelManagePageVisible = true;
        this.hotelDetailPageVisible = false;
        this.hotelRoomManagePageVisible = true;
        this.hotelRoomDetailPageVisible = false;
        this.init();
      }
    },


    submitHotel(v) {
      this.$refs.hotelDetailForm.validate(valid => {
        if (valid) {
          let url = "";
          if(this.hotelDetailForm.opentime){
            this.hotelDetailForm.opentime = dateFormatUtil.format(new Date(this.hotelDetailForm.opentime),"yyyy-MM-dd");
          }
          if(this.hotelDetailForm.decoratetime){
            this.hotelDetailForm.decoratetime = dateFormatUtil.format(new Date(this.hotelDetailForm.decoratetime),"yyyy-MM-dd");
          }
          console.log(this.hotelDetailForm);
          console.log(this.hotelDetailModalType)
          if (this.hotelDetailModalType === 1) {
            url = "/hotel/update";
            this.submitLoading = true;
            let updateHotel = this.hotelDetailForm;

            this.putRequest(url, updateHotel).then(res => {
              this.submitLoading = false;
              if (res.success === true) {
                this.$Message.success("更新操作成功");

                this.hotelManagePageVisible = true;
                this.hotelDetailPageVisible = false;

                this.init();

              }
            });


          }else if(this.hotelDetailModalType === 0){
            url = "/hotel/create";
            this.submitLoading = true;
            let createHotel = this.hotelDetailForm;
            createHotel.status = 0;
            if(createHotel.id) delete createHotel.id;
            this.postRequest(url, createHotel).then(res => {
              this.submitLoading = false;
              if (res.success === true) {
                this.$Message.success("添加成功");

                this.hotelManagePageVisible = true;
                this.hotelDetailPageVisible = false;

                this.init();
              }
            });    
          }

        }
      });

    },
    cancelSubmitHotel() {
      this.hotelManagePageVisible = true;
      this.hotelDetailPageVisible = false;
      this.hotelRoomManagePageVisible = true;
      this.hotelRoomDetailPageVisible = false;
    },
    hotelDetailPropertySelect(){
      console.log("=============hotelDetailPropertySelect===========");
      this.modalTitle = "属性设置";
      this.hotelDetailPropetyModalVisible = true;
      
    },
    hotelDetailTagSelect(){
      // this.modalTitle = "图标设置";
      // this.hotelDetailTagModalVisible = true;
      //获取当前的图标 回显
      console.log("============main-selectedTagsArr=================");
      console.log(this.selectedTagsArr);
      this.$refs.tagModal.openReviewModal(this.selectedTagsArr);

    }


    //hotel detail end


    //hotelRoom manage start
    ,
    addHotelRoom(v) {
      if(this.currentSelectedHotel === ""){
       this.$Modal.warning({
          title: "酒店选择",
          content: "请先选择酒店"
        });
        return;
      }
      this.$refs.hotelRoomDetailComp.resetFormByType(0,this.currentSelectedHotel,null);
      //切换界面显示隐藏
      this.hotelManagePageVisible = false;
      this.hotelDetailPageVisible = false;
      this.hotelRoomManagePageVisible = false;
      this.hotelRoomDetailPageVisible = true;
      
     
      // 切换界面显示隐藏
      // this.hotelRoomDetailModalType = 0;
      // this.hotelRoomButtonTypeText = "添加房型";
      // this.hotelRoomButtonTypeIcon = "plus-round";

      // this.$refs.hotelRoomDetailForm.resetFields();
      // for (let attr in this.hotelRoomDetailForm) {
      //   if (this.hotelRoomDetailForm[attr] == null) {
      //     this.hotelRoomDetailForm[attr] = "";
      //   }
      // }
      // this.hotelManagePageVisible = false;
      // this.hotelDetailPageVisible = false;
      // this.hotelRoomManagePageVisible = false;
      // this.hotelRoomDetailPageVisible = true;

      

    },
    editHotelRoom(v) {
      // this.hotelRoomDetailModalType = 1;
      // this.hotelRoomButtonTypeText = "编辑房型";
      // this.hotelRoomButtonTypeIcon = "edit";

      // this.$refs.hotelRoomDetailForm.resetFields();
      // // 转换null为""
      // for (let attr in v) {
      //   if (v[attr] === null) {
      //     v[attr] = "";
      //   }
      // }

      let editHotelRoomId = v.id;
      this.submitLoading = true; 
      this.getRequest("/hotel/room/getHotelRoomById/" + editHotelRoomId).then(res =>{
        this.submitLoading = false;
        console.log(res.result);
        let editHotelRoom = res.result;
        this.$refs.hotelRoomDetailComp.resetFormByType(1,this.currentSelectedHotel,editHotelRoom);
        // this.hotelRoomDetailForm = editHotelRoom;

        //切换界面显示隐藏
        this.hotelManagePageVisible = false;
        this.hotelDetailPageVisible = false;
        this.hotelRoomManagePageVisible = false;
        this.hotelRoomDetailPageVisible = true;

      })

    },
    
    removeHotelRoom(v) {
      console.log(v);
      this.$Modal.confirm({
        title: "确认删除",
        content: "您确认要删除房型 " + v.roomName + " ?",
        onOk: () => {
          this.deleteRequest("/hotel/room/delete/", { ids: v.id }).then(res => {
            if (res.success === true) {
              this.$Message.success("删除成功");
              // this.init();
              this.getHotelRoomListByHotelId(this.currentSelectedHotel.id);
            }
          });
        }
      });
    },

    //hotelRoom manage end


    // //hotelRoomdetail manage start
    hotelRoomDetailCancel:function(v){
      if(v){
        this.hotelManagePageVisible = true;
        this.hotelDetailPageVisible = false;
        this.hotelRoomManagePageVisible = true;
        this.hotelRoomDetailPageVisible = false;
      }
    },
    hotelRoomSubmitSuccess: function(v){
      if(v){
        this.hotelManagePageVisible = true;
        this.hotelDetailPageVisible = false;
        this.hotelRoomManagePageVisible = true;
        this.hotelRoomDetailPageVisible = false;
        // this.init();
        this.getHotelRoomListByHotelId(this.currentSelectedHotel.id);
      }
    },
    
    submitHotelRoom(v) {
      this.$refs.hotelRoomDetailForm.validate(valid => {
        if (valid) {
          let url = "";
          console.log(this.hotelRoomDetailForm);
          console.log(this.hotelRoomDetailModalType)
          if (this.hotelRoomDetailModalType === 1) {
            url = "/hotel/room/update";
            this.submitLoading = true;
            let updateHotelRoom = this.hotelRoomDetailForm;

            // if(updateHotelRoom.status) delete updateHotelRoom.status;
            updateHotelRoom.status = 0;
            updateHotelRoom.payType = 0;
            this.putRequest(url, updateHotelRoom).then(res => {
              this.submitLoading = false;
              if (res.success === true) {
                this.$Message.success("更新操作成功");
                // this.hotelManagePageVisible = true;
                // this.hotelDetailPageVisible = false;
                this.init();
              }
            });


          }else if(this.hotelRoomDetailModalType === 0){
            url = "/hotel/room/create";
            this.submitLoading = true;
            let createHotelRoom = this.hotelRoomDetailForm;
            createHotelRoom.hotelId = "00001";
          //   createHotel.status = 0;
            if(createHotelRoom.id) delete createHotelRoom.id;
            this.postRequest(url, createHotelRoom).then(res => {
              this.submitLoading = false;
              if (res.success === true) {
                this.$Message.success("添加成功");
                this.init();
              }
            });    
          }

        }
      });

    },


    cancelSubmitHotelRoom() {
      this.hotelManagePageVisible = true;
      this.hotelDetailPageVisible = false;
      this.hotelRoomManagePageVisible = true;
      this.hotelRoomDetailPageVisible = false;
    }
    //hotelRoomdetail manage end


  },
  mounted() {
    this.init();
    // this.getRoleList();
  }
};
</script>